import { Menu } from 'antd'
import { DesktopOutlined, SettingOutlined, TeamOutlined } from '@ant-design/icons'
import styles from './index.module.less'
import { useNavigate } from 'react-router-dom'
import { Link } from 'react-router-dom'

const SideMenu = () => {
  const navigate = useNavigate()
  const items = [
    {
      key: 1,
      label: <Link to={'/dashboard'}>工作台</Link>,
      icon: <DesktopOutlined />
    },
    {
      key: 2,
      label: '系统管理',
      icon: <SettingOutlined />,
      children: [
        {
          key: 3,
          label: <Link to={'/user'}>用户管理</Link>,
          icon: <TeamOutlined />
        },
        {
          key: 4,
          label: <Link to={'/dept'}>部门</Link>,
          icon: <TeamOutlined />
        }
      ]
    }
  ]

  return (
    <div className='Menu'>
      <div className={styles.logo} onClick={() => navigate('/welcome')}>
        <svg
          className={styles.svg}
          viewBox='0 0 1024 1024'
          version='1.1'
          xmlns='http://www.w3.org/2000/svg'
          p-id='26651'
          width='200'
          height='200'
        >
          <path
            d='M458.851211 403.930796l-17.716263 77.951557 159.446367-42.519031-7.086505-35.432526zM391.529412 683.847751l131.100346 106.297578 134.643598-102.754326-31.889273-134.643598-216.138408 56.692041zM607.66782 474.795848l-177.16263 46.062283-10.629757 49.605537 198.422145-53.148789zM593.49481 368.49827L639.557093 251.570934h-230.311418l49.605536 116.927336z'
            fill='#486782'
            p-id='26652'
          ></path>
          <path
            d='M512 10.629758C235.626298 10.629758 8.858131 233.854671 8.858131 513.771626s223.224913 503.141869 503.141869 503.141869 503.141869-223.224913 503.141869-503.141869S788.373702 10.629758 512 10.629758z m177.16263 698.020761L533.259516 825.577855c-3.543253 3.543253-7.086505 3.543253-10.629758 3.543252-3.543253 0-7.086505 0-10.629758-3.543252l-152.359862-120.470589c-7.086505-3.543253-7.086505-10.629758-7.086505-17.716263L426.961938 389.757785l-60.235294-148.816609c-3.543253-7.086505 0-10.629758 0-17.716263s7.086505-7.086505 14.17301-7.086505h283.460208c7.086505 0 10.629758 3.543253 14.17301 7.086505 3.543253 3.543253 3.543253 10.629758 3.543253 17.716263L625.384083 389.757785l70.865052 304.719724c0 3.543253-3.543253 10.629758-7.086505 14.17301z'
            fill='#486782'
            p-id='26653'
          ></path>
        </svg>
        <span className={styles.title}>苏州精之研软件</span>
      </div>
      <div className='side-menu'>
        <Menu defaultSelectedKeys={['1']} defaultOpenKeys={['sub1']} mode='inline' theme='dark' items={items}></Menu>
      </div>
    </div>
  )
}

export default SideMenu
